<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TCC 管理后台</title>
    <link rel="stylesheet" href="../static/layui/css/layui.css" media="all">
</head>
<body style="background: #f8f8f8">

<div class="layui-layout-body" id="app">
    <div style="margin-left: 15px;">
        <span style="padding: 0 1px 0 0; margin-left: 50px;"><h3>TCC 管理后台</h3></span>
    </div>
    <div class="layui-card">
        <div class="layui-card-header">
            <form class="layui-form">
                <div class="layui-row">
                    <div class="layui-col-md2" style="width: 60px; margin: -3px 0px 0px 0px;">
                        <button class="layui-btn layui-btn-primary" type="button" v-on:click="add">
                            <i class="layui-icon layui-icon-template-1"></i>
                        </button>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">server</label>
                            <div class="layui-input-block">
                                <select class="server">
                                    <option value=""></option>
                                    <option v-for="item in servers" :key="item">{{item}}</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">type</label>
                            <div class="layui-input-block">
                                <select class="type">
                                    <option value=""></option>
                                    <option value="1">发起者</option>
                                    <option value="2">参与者</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">status</label>
                            <div class="layui-input-block">
                                <select class="status">
                                    <option value=""></option>
                                    <option value="1">try</option>
                                    <option value="2">confirm</option>
                                    <option value="3">cancell</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">count</label>
                            <div class="layui-input-block">
                                <select class="count">
                                    <option value=""></option>
                                    <option value="10">10</option>
                                    <option value="20">20</option>
                                    <option value="30">30</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2">
                        <div class="layui-form-item">
                            <label class="layui-form-label">result</label>
                            <div class="layui-input-block">
                                <select class="result">
                                    <option value=""></option>
                                    <option value="0">未知</option>
                                    <option value="1">成功</option>
                                    <option value="-1">失败</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md2" style="width: 60px;margin: -3px 0px 0px 15px;">
                        <div>
                            <button class="layui-btn layui-btn-primary" type="button" v-on:click="search">
                                <i class="layui-icon layui-icon-search"></i>
                            </button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="layui-card-body">
            <table class="layui-hide" id="tableId" lay-filter="tableId"></table>
        </div>
    </div>
    <div id="dataSource" style="display: none;margin-top: 20px;">
        <form class="layui-form" action="">
            <div class="layui-form-item">
                <label class="layui-form-label">来源</label>
                <div class="layui-input-block" style="width: 350px;">
                    <select name="type" lay-verify="required" lay-filter="type">
                        <option value="3">请选择</option>
                        <option value="1">jdbc</option>
                        <option value="2">redis</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">url </label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="text" name="url" required lay-verify="required" placeholder="请输入连接地址"
                           autocomplete="off" v-model="url" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" v-if="type==1">
                <label class="layui-form-label">user</label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="text" name="user" placeholder="请输入账号" autocomplete="off" value="root"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="password" name="password" placeholder="请输入密码" autocomplete="off" value="123"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" v-if="type==1">
                <label class="layui-form-label">表名</label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="text" name="table" placeholder="请输入表名" autocomplete="off" value="TCC_TRANSACTION"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" v-if="type==2">
                <label class="layui-form-label">port</label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="number" name="port" placeholder="请输入端口" autocomplete="off" value="6379"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" v-if="type==2">
                <label class="layui-form-label">db  </label>
                <div class="layui-input-block" style="width: 350px;">
                    <input type="number" name="db" placeholder="请输入库" autocomplete="off" value="0"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block" style="width: 350px;margin-left: 65px;">
                    <button class="layui-btn" lay-submit lay-filter="add_from">立即提交</button>
                </div>
            </div>
        </form>
    </div>
</div>
</body>
<script src="../static/layui/layui.js"></script>
<script src="https://cdn.bootcss.com/jquery/1.12.3/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="../static/js/index.js"></script>
<script>
</script>
</html>